{% comment %}
<!--
  Copyright (C) 2008 ZHENG Zhong <http://www.zhengzhong.net/>

  Created on 2009-04-30.
  $Id$
-->
{% endcomment %}

<div id="scenes" class="ajax_box">

  <!-- main _____________________________________________________________________________________-->
  
  <div class="main">
  
    {% for scene in scenes %}
    
      <div id="scene_{{scene.key.id}}" class="scene">
      
        <div class="scene_head">
          <a href="{{webapp_}}/movie/{{scene.parent.key.id}}/{{scene.key.id}}/">
            Starting from {{scene.start_time}} minutes ({{scene.seconds}} seconds) ...
          </a>
        </div>
        
        <div class="scene_body">
        
          <div class="right_box">
            {% with scene.youtube_link as youtube_link %}
              {% include "hottywood/include/embed_youtube.html" %}
            {% endwith %}
          </div>
          
          {% include "hottywood/include/scene_description.html" %}
          {% include "hottywood/include/scene_involved.html" %}
          {% include "hottywood/include/scene_visibility.html" %}
          
          <!-- vote scene form __________________________________________________________________-->
          
          <div class="scene_info">
            {% if user_ %}
              {% if scene.current_user_opinion %}
                <b>You have {{scene.current_user_opinion}} it.</b>
              {% endif %}
              <a href="javascript:void(0);" onclick="$('#vote_scene_{{scene.key.id}}_form').toggle();">
                {% if scene.current_user_opinion %}
                  <b>Want to change your mind?</b>
                {% else %}
                  <b>What's your opinion?</b>
                {% endif %}
              </a>
              <form id="vote_scene_{{scene.key.id}}_form"
                    class="form hidden"
                    action="."
                    method="POST"
                    onsubmit="return submitAjaxForm('#scenes', '#vote_scene_{{scene.key.id}}_form');">
                <input type="hidden" name="ajax_box" value="scenes"/>
                <input type="hidden" name="action" value="vote_scene"/>
                <input type="hidden" name="scene_id" value="{{scene.key.id}}"/>
                <div>
                  <span>
                    <input type="radio" name="vote" value="confirmed" checked="checked"/>
                    <img src="{{static_}}/images/confirm_icon.gif" alt="Confirm"/>
                    I confirm!
                  </span>
                  <span>
                    <input type="radio" name="vote" value="disproved"/>
                    <img src="{{static_}}/images/disprove_icon.gif" alt="Disprove"/>
                    I disprove!
                  </span>
                  <span>
                    <input class="button" type="submit" value="Vote"/>
                  </span>
                  <span class="ajax_indicator hidden">
                    <img src="{{static_}}/images/ajax_indicator.gif" alt="AJAX Indicator"/>
                  </span>
                </div>
              </form>
            {% else %}
              <div class="toggle_link">
                <a href="{{sign_in_url_}}">[sign in to vote for this scene]</a>
              </div>
            {% endif %}
          </div>
          
          <div class="clear"></div>
        
        </div><!--/.scene_body-->
        
        <div class="scene_foot">
          <img src="{{static_}}/images/add_icon.gif" alt="Submitter" title="Submitter"/>
          Added on {{scene.submit_date|date:"Y-m-d"}} by
          <a href="{{webapp_}}/user/{{scene.submitter.user_id}}/">
            {{scene.submitter.nickname|escape}}
          </a>
          |
          <img src="{{static_}}/images/confirm_icon.gif" alt="Confirmed" title="Confirmed"/>
          {{scene.confirmed|length}}
          |
          <img src="{{static_}}/images/disprove_icon.gif" alt="Disproved" title="Disproved"/>
          {{scene.disproved|length}}
          |
          <img src="{{static_}}/images/favor_icon.gif" alt="Favored" title="Favored"/>
          {{scene.favored|length}}
          |
          <img src="{{static_}}/images/comment_icon.gif" alt="Comments" title="Comments"/>
          {{scene.comments}}
          |
          <img src="{{static_}}/images/page_icon.gif" alt="Open scene page" title="Open scene page"/>
          <a href="{{webapp_}}/movie/{{scene.parent.key.id}}/{{scene.key.id}}/">
            Open scene page
          </a>
        </div><!--/.scene_foot-->
      
      </div><!--/.scene-->
    
    {% endfor %}{# scene in scenes #}
    
    {% include "hottywood/ajax/ajax_error.html" %}
  
  </div>
  
  <!-- view _____________________________________________________________________________________-->
  
  <div class="view">
  
    <div class="toggle_link">
      {% if user_ %}
        <a href="javascript:void(0);" onclick="toggleBox('#scenes');">
          [add a hot scene]
        </a>
      {% else %}
        <a href="{{sign_in_url_}}">[sign in to add a hot scene]</a>
      {% endif %}
    </div>
  
  </div><!--/.view-->
  
  <!-- edit _____________________________________________________________________________________-->
  
  {% if user_ %}
  
    <div class="edit hidden">
    
      <form id="add_scene_form" class="small form" action="." method="POST"
            onsubmit="return submitAjaxForm('#scenes', '#add_scene_form');">
        <input type="hidden" name="ajax_box" value="scenes"/>
        <input type="hidden" name="action" value="add_scene"/>
        <table>
          <tbody>
            <tr>
              <th style="width:1%;"><span class="nowrap">Start time (minutes) * :</span></th>
              <td><input type="text" name="start_time"/></td>
            </tr>
            <tr>
              <th style="width:1%;"><span class="nowrap">Duration (seconds) * :</span></th>
              <td><input type="text" name="seconds"/></td>
            </tr>
            <tr>
              <th style="width:1%;"><span class="nowrap">Description :</span></th>
              <td><textarea name="description"></textarea></td>
            </tr>
            <tr>
              <th style="width:1%;"><span class="nowrap">Video link :</span></th>
              <td><input type="text" name="video_url" value="http://"/></td>
            </tr>
            <tr>
              <th style="width:1%;"><span class="nowrap">Actress involved :</span></th>
              <td><input type="text" name="actress"/></td>
            </tr>
            <tr>
              <th style="width:1%;"><span class="nowrap">Actor involved :</span></th>
              <td><input type="text" name="actor"/></td>
            </tr>
            <tr>
              <th style="width:1%;"><span class="nowrap">Visibility :</span></th>
              <td>
                <input type="checkbox" name="breast" value="true"/> Breast is visible.<br/>
                <input type="checkbox" name="hips" value="true"/> Hips are visible.<br/>
                <input type="checkbox" name="legs" value="true"/> Legs are visible.<br/>
              </td>
            </tr>
            <tr>
              <th style="width:1%;"></th>
              <td>
                <div>
                  <input class="button" type="submit" value="Add this scene!"/>
                  <input class="button" type="button" onclick="toggleBox('#scenes');" value="Cancel"/>
                  <span class="ajax_indicator hidden">
                    <img src="{{static_}}/images/ajax_indicator.gif" alt="AJAX Indicator"/>
                  </span>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </form><!--/#add_movie_scene_form-->
    
    </div><!--/.edit-->
  
  {% endif %}

</div><!--/#scenes-->


